<template>
    <view class="wrap" @click="itemClick">
        <view class="tag">{{item.schemeTypeStr}}</view>
        <image class="cover" :src="item.modelUrl|mmvImageUrl"></image>
        <view class="content">
            <view class="title">
				<view>{{item.brandName}}</view>
				<view>{{item.seriesName}} </view>
			</view>
            <!-- <view class="desc">{{item.modelName}} {{filterNull(item.carModelRemark)}}</view> -->
			<view class="desc">{{item.modelName}}</view>
           <view class="price" v-if="item.guidePrice">
			   <text class='price1'>指导价 </text>
			   <text class='price2'>¥{{formatDate(item.guidePrice)}}</text>
			   <text class='price3'>万/起</text>
			</view>
            <view class="price" v-if="item.monthlyRent">
				<text class='price1'>月租金 </text>
				<text class='price2'>¥{{formatDate(item.monthlyRent)}}</text>
				<text class='price3'>/月起</text>
			</view>
        </view>
    </view>
</template>

<script>
export default {
    name: 'mmv-buy-basic',
    props: {
        bizType: {
            type: [String, Number],
        },
        item: {
            type: Object,
            default: function () {
                return {};
            },
        },
    },
    components: {},
    methods: {
        itemClick() {
            uni.navigateTo({
                url: '/pages/car/cardetail/cardetail?bizType=' + this.bizType + "&schemeId=" + this.item.schemeId + "&subSchemeId=" + this.item.subSchemeId  + "&subSchemeRentId=" + this.item.subSchemeRentId + "&cavanFlag=" + this.item.cavanFlag
            });
        },
		formatDate(data){
			if(data){
				var result = Math.round(data)
			  if (result >= 10000) {
				return (result / 10000).toFixed(0) + '万';
			   }
			  return result.toString(); // 小于 10000 直接返回
			}else{
				return '--'
			}
		}
    },
}
</script>

<style lang="scss" scoped>
.wrap {
    background: #ffffff;
    border-radius: 8upx;
    margin-bottom: 30upx;
	position: relative;
}

.tag {
    position: absolute;
    top: 0upx;
    left: 0;
    background: #C8DD41;
    border-radius: 4px 0 8upx 0px;
    font-size: 24upx;
    font-weight: bold;
    color: #173B42 ;
    padding: 6upx 24upx;
}

.cover {
    width: 332upx;
    height: 240upx;
    border-radius: 8upx;
    display: block;
}

.content {
    padding: 24upx;
}

.title {
    font-size: 32upx;
    font-weight: bold;
    color: #000000;
	margin-bottom: 28upx;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.desc {
    font-size: 24upx;
    color: #999999 ;
    margin-bottom: 28upx;
	max-width: 280upx;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.price {
    font-size: 24upx;
    color: #FF6A15;
	.price1{
		padding:4upx 8upx;
		border: 2upx solid #FF6A15 ;
		margin-right: 24upx;
		border-radius: 4upx;
		color: #FF6A15;
		font-size: 24upx;
	}
	.price2{
		font-weight: bold;
		margin-right: 12upx;
		color: #FF6A15;
		font-size: 28upx;
	}
	.price3{
		font-size: 20upx;
		color:#999999 
	}
}
</style>